<!DOCTYPE html>
<html lang="en">
<head>
    <!-- Bootstrap core CSS -->
    <link href="template/assets/css/bootstrap.css" rel="stylesheet">
    <!--external css-->
    <link href="template/assets/font-awesome/css/font-awesome.css" rel="stylesheet" />
    <link rel="stylesheet" type="text/css" href="template/assets/css/zabuto_calendar.css">
    <link rel="stylesheet" type="text/css" href="template/assets/js/gritter/css/jquery.gritter.css" />
    <link rel="stylesheet" type="text/css" href="template/assets/lineicons/style.css">

    <!-- Custom styles for this template -->
    <link href="template/assets/css/style.css" rel="stylesheet">
    <link href="template/assets/css/style-responsive.css" rel="stylesheet">
    <link href="template/plugins/dialog/dist/ui-dialog.css?"  rel="stylesheet">

    <script src="template/assets/js/jquery.js"></script>
    <script type="text/javascript" src="template/assets/js/jquery-1.8.3.min.js"></script>
    <script type="text/javascript" src="template/assets/js/bootstrap.min.js"></script>
</head>
<body>
<div class="form-group">
    <form id='form' name="form" class="form-horizontal style-form">
        <table class="table table-bordered ">
            <thead>
            <tr>
                <th>名称 <i class="text-danger">*</i></th>
                <th>描述</th>
                <th></th>
            </tr>
            </thead>
            <tbody class="tbody">
            <tr>
                <td><input type="text" name="title[]" class="form-control"></td>
                <td><textarea name="remark[]" class="form-control"></textarea></td>
                <td><i class="fa fa-plus add_row" style="cursor: pointer;"></i></td>
            </tr>
            </tbody>
        </table>
        <div class="text-center col-sm-10">
            <button type="button" class="btn btn-success save"> 提 交 </button>
        </div>
    </form>
</div>
<script>
    $(".save").click(function () {
        var url ='userGroup.php?&act=save';
        var data = $("#form").serialize();
        $.post(url,data).success(function (data) {
            var ret = JSON.parse(data) ;
            if(!ret.ret)
            {
                alert(ret.msg);
            }
            else{
                window.parent.ModalClose();
            }
        })

    });

    $('.add_row').click(function () {
        addrow();
    });

    function delRow(obj) {
       $(obj).parents('tr').remove();
    }

    function  addrow() {
        var tr = '<tr> <td> <input type="text" name="title[]" class="form-control" required></td> <td><textarea name="remark[]" class="form-control"></textarea></td> <td><i class="fa fa-minus add_row" style="cursor: pointer;" onclick="delRow(this)"></i>  <i class="fa fa-plus add_row" style="cursor: pointer;" onclick="addrow();"></i></td> </tr>';
        $(".tbody").append(tr);
    }
    
</script>
</body>

</html>

